<template>
	<view class="page-container pay-result-container">
		<view class="pay-info-box">
			<view class="pay-info-image">
				<image :src="$img_path('/home/order/pay-success.png')" mode="widthFix"></image>
			</view>
			<view class="tip">
				<text>支付成功</text>
			</view>
			<view class="pay-tip" v-if="info.pay && info.pay.payprice">
				<text>{{info.pay.paytype=='4' ? '余额支付' : info.pay.paytype=='0' ? '微信支付' : ''}} 实付¥ {{info.pay.payprice.toFixed(2)}}</text>
			</view>
		</view>
		<view class="btns">
			<view class="btn" @click="back">
				<text>返回</text>
			</view>
			<view class="btn order-btn common-btn-bg-color" @click="gotoOrderDetail">
				<text>查看订单</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info:{}
			}
		},
		onLoad(options) {
			console.log(options)
			this.info = JSON.parse(options.data)
		},
		methods: {
			back() {
				uni.navigateBack()
			},
			gotoOrderDetail() {
				console.log("前往详情页")
				uni.navigateTo({
					url:`/pagesOrder/pages/orderDetail/orderDetail?id=${this.info.pay.id}`
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.pay-result-container {
	box-sizing: border-box;
	min-height: 100vh;
	background-color: #fff;
	padding: 22rpx;
}

.pay-info-box {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 104rpx;
	flex-direction: column;
	
	.pay-info-image {
		width: 200rpx;
		height: 200rpx;
	}
	
	image {
		width: 100%;
		height: 100%;
	}
	
	.tip {
		margin-top: 30rpx;
		font-weight: bold;
		font-size: 36rpx;
		color: #333333;
	}
	
	.pay-tip {
		margin-top: 22rpx;
		font-weight: bold;
		font-size: 30rpx;
		color: #333333;
	}
}

.btns {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 166rpx;
	
	.btn {
		width: 300rpx;
		height: 96rpx;
		background: #F8F8F8;
		border-radius: 80rpx 80rpx 80rpx 80rpx;
		font-weight: bold;
		font-size: 36rpx;
		color: #999999;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.order-btn {
		font-weight: bold;
		font-size: 36rpx;
		color: #FFFFFF;
	}
}
</style>
